<template>
  <BasicModal title="银行划转" :width="400"
    :canFullscreen="false"
    :centered="true"
    :destroyOnClose="true"
    @register="registerModal"
    @ok="handleSubmit"
  >
    <BasicForm @register="registerForm" :model="model" ></BasicForm>
  </BasicModal>
</template>

<script lang="ts" name="BankTransfer" setup>
import { ref, computed, unref, reactive } from "vue";
import { BasicModal, useModalInner } from "/@/components/Modal";
import { BasicForm, useForm } from "/@/components/Form/index";
import { bankTransfer } from "/@/views/full/bank/types/bank.api";
import { useMessage } from "/@/hooks/web/useMessage";

import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import moment from 'dayjs'

const $message = useMessage();

// 声明Emits
const emit = defineEmits(['success', 'register']);

//表单modal
const model = reactive<any>({})

//表单配置
const [registerForm, {resetFields, setFieldsValue, validate, updateSchema}] = useForm({
  schemas: [
    {
      label: "划转部门",
      field: "ddlx",
      component: "JDictSelectTag",
      componentProps: {
        dictCode: "ddlxType@ddlxUser",
        placeholder: " ",
        stringToNumber: true,
        getPopupContainer: () => document.body,
        onChange: (value) => {
          updateSchema([
            {
              field: "goid",
              componentProps: {
                dictCode: "chee_bank,djm,id@ddlxBank?ddlx=" + value,
              },
            },
            {
              field: "coid",
              componentProps: {
                dictCode: "chee_bank,djm,id@ddlxBank?ddlx=" + value,
              },
            },
          ])
        }
      },
      required: true
    },
    {
      label: "转出银行",
      field: "goid",
      component: "JDictSelectTag",
      componentProps: {
        dictCode: "chee_bank,djm,id@ddlxBank",
        placeholder: " ",
        stringToNumber: true,
        getPopupContainer: () => document.body,
      },
      required: true
      //slot: "goid",
    },
    {
      label: "转入银行",
      field: "coid",
      component: "JDictSelectTag",
      componentProps: {
        dictCode: "chee_bank,djm,id@ddlxBank",
        placeholder: " ",
        stringToNumber: true,
        getPopupContainer: () => document.body,
      },
      required: true
      //slot: "coid"
    },
    {
      label: "记账日期",
      field: "jzsj",
      component: "DatePicker",
      defaultValue: moment().format("YYYY-MM-DD"),
      componentProps: { 
        valueFormat: "YYYY-MM-DD",
        getPopupContainer: () => document.body,
       },
      required: true
    },
    { label: "划转金额", field: "je", component: "InputNumber", required: true },
  ],
  labelWidth: 100,
  baseColProps: {span: 20},
  showActionButtonGroup: false,
});

const formEl = ref();
const isUpdate = ref(true);
//表单赋值
const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
  await resetFields()
});

//表单提交事件
async function handleSubmit() {
  try {
    setModalProps({confirmLoading: true});
    const values = await validate();
    await bankTransfer(values).then((res) => {
      if (res.success) {
        $message.createMessage.success(res.message);
        //关闭弹窗
        closeModal();
        emit("success");
      } else {
        $message.createMessage.warning(res.message);
      }
    });
  } catch (e) {
    console.log(e);
  } finally {
    setModalProps({confirmLoading: false});
  }
}

</script>

<style lang="less" scoped>

</style>
